*,:after,:before {
    outline: 0;
    -webkit-tap-highlight-color: transparent;
    box-sizing: border-box
}

html {
    font-size: 62.5%;
    height: 100%;
    background: #eee
}

body {
    height: 100%;
    line-height: 1;
    font-family: "Microsoft Yahei";
    background-color: #fff;
    font-size: 12px;
    color: #5d5b5b;
    min-width: 320px;
    max-width: 640px;
    margin: 0 auto;
    display: block;
    position: relative
}

em,i,var {
    font-style: normal
}

h1,h2,h3,h4,h5,h6 {
    margin: 0;
    font-size: inherit
}
img {
    vertical-align: inherit
}

ul {
    list-style: none;
    padding: 0;
    margin: 0
}

p {
    margin: 0
}

input {
    outline: 0;
    -webkit-appearance: none
}

a {
    color: #5d5b5b;
    text-decoration: none
}

dd,dl {
    margin: 0
}

textarea {
    outline: 0;
    -webkit-appearance: none
}

.ng-cloak {
    display: none
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0
}

.clearline {
    height: 0;
    line-height: 0;
    font-size: 0;
    overflow: hidden;
    clear: both
}

.clearperfect {
    clear: both;
    height: 0;
    overflow: hidden
}

.qlMTBottom,.webkitBox,[class*=wkBox] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.boxFlex,[class*=boxFl] {
    width: 100%;
    display: block;
    -webkit-box-flex: 1;
    box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden
}

.elli {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-break: break-all
}

.multi-elli {
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

body.gra_1 {
    background-color: #efeff4
}

body.gra_2 {
    background-color: #F2F2F2
}

body.gra_3 {
    background-color: #ebebeb
}

body.gra_4 {
    background-color: #f0f0f0
}

body.blu_1 {
    background-color: #def4ff
}

.btn_qlcheckbox.on:before,.btn_qlradio.on:before,.list_btn_1:after,.list_btn_2:after,.right-arrow::before,[class*=qlbgi],[class*=qlbga]:after,[class*=qlbgb]:before {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/live_logo.png?v=newchannel) no-repeat;
    background-size: 75rem auto
}

[class*=codebydodomon] {
    background: #f5f5f5;
    display: block;
    width: 100%;
    padding: 1rem;
    line-height: 2rem;
    color: #000
}

.geneBox .gene_close,.qlMsgTips .qlMT_close,.qlMsgTips .qlMT_close2,[class*=qlbma]:after,[class*=qlbmb]:before,[class*=qlbmi] {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/live_logo_60.png?v=aoep) no-repeat;
    background-size: 60rem auto
}

[class*=qlbma]:after,[class*=qlbmb]:before,[class*=qlbga]:after,[class*=qlbgb]:before {
    content: '';
    display: inline-block;
    vertical-align: top
}

[class*=" icon_"],[class^=icon_] {
    vertical-align: top;
    line-height: inherit
}

[class*=" icon_"]:before,[class^=icon_]:before {
    vertical-align: top
}

.vip-logo {
    display: inline-block;
    vertical-align: top;
    background-color: #f0a900;
    font-size: .8rem;
    text-align: center;
    padding: 0 .2rem;
    border-radius: 1px;
    height: 1.2rem;
    line-height: 1.2rem;
    margin: .3rem .5rem 0 0;
    color: #fff;
    font-family: Roboto;
    -webkit-text-size-adjust: none
}

.vip-logo::before {
    content: "VIP";
    text-shadow: unset
}

[class^=ql_header_] {
    width: 100%;
    height: 5rem;
    line-height: 5rem;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    z-index: 5
}

.ql_header_1 {
    background: #73ace8
}

[class^=ql_header_] .right_item {
    float: right
}

[class^=ql_header_] .left_item {
    float: left
}

[class^=ql_header_] a {
    color: #fff;
    font-size: 1.4rem;
    padding: 0 1rem 0 0
}

.qlbgb_back {
    display: inline-block;
    max-width: 17rem;
    max-height: 6rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.qlbgb_back:before {
    content: "";
    width: 2rem;
    height: 2rem;
    display: inline-block;
    background-position: -60rem 0;
    vertical-align: top;
    margin: 1.5rem .5rem 0 1rem
}

[class^=wt_footer_] {
    height: 5.9rem;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 5
}

.wt_footer_1 {
    background: #f5f5f5;
    border-top: solid 1px #aaaaad;
    white-space: nowrap;
    overflow: hidden
}

.wt_footer_2 {
    white-space: nowrap;
    overflow: hidden;
    box-shadow: 0 0 5px 1px #ccc
}

[class^=wt_footer_] .tlbtn_bottom {
    width: 100%;
    font-size: 1.6rem;
    color: #fff;
    background-color: #2984e2;
    height: 5.9rem;
    line-height: 5.9rem;
    text-align: center;
    border-radius: 0
}

[class*=main_box_] {
    width: 100%;
    position: absolute;
    overflow: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch
}

.main_box_1 {
    top: 5rem;
    bottom: 5.9rem
}

.main_box_2 {
    top: 5rem;
    bottom: 0
}

.main_box_3 {
    top: 0;
    bottom: 5.9rem
}

.main_box_4 {
    top: 0;
    bottom: 0
}

.main_box_5 {
    top: 0;
    bottom: 0
}

.main_box_5:after {
    content: '';
    display: block;
    height: 7rem
}

.main_box_6 {
    top: 0;
    bottom: 0
}

.main_box_6:after {
    content: '';
    display: block;
    height: 7rem
}

.main_box_7 {
    top: 0;
    bottom: 5.9rem
}

.main_box_7:after {
    content: '';
    display: block;
    height: 3rem
}

.main_box_re {
    position: relative
}

[class^=main_box_]:before {
    content: "Qianâ€”Liao";
    display: block;
    position: absolute;
    left: 0;
    top: -100px;
    color: #fff;
    z-index: 888
}

.nav_list {
    margin: 1rem 0 0;
    background: #fff;
    font-size: 1.6rem
}

.nav_list li {
    padding: 1rem 0;
    border-bottom: solid 1px #f5f5f5;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.nav_list li:last-child {
    border-bottom: none
}

.nav_list li.flexible {
    height: auto
}

.nav_list span.spacer {
    height: 3rem;
    line-height: 3rem;
    color: #333;
    font-size: 1.4rem;
    background-color: #f2f2f2;
    padding: 0 1rem;
    display: block
}

.nav_list li.li_bl {
    display: block
}

.nav_list li span.flex textarea.auto_height {
    overflow: hidden;
    height: auto
}

.nav_list li span.flex textarea.auto_height::-webkit-input-placeholder {
    color: #999
}

.nav_list li span.flex textarea.auto_height::-moz-placeholder {
    color: #999
}

.nav_list li span.flex textarea.auto_height:-ms-input-placeholder {
    color: #999
}

.nav_list li span.flex textarea.auto_height::placeholder {
    color: #999
}

.nav_list li span.flex textarea.auto_height::-moz-placeholder {
    color: #999
}

.nav_list .title_1,.nav_list .title_2,.nav_list .title_3 {
    height: 3rem;
    padding: 0 .5rem 0 0;
    line-height: 3rem;
    text-align: right;
    display: inline-block;
    white-space: nowrap;
    color: #3d4245;
    font-size: 1.5rem
}

.nav_list .title_1 {
    width: 10rem
}

.nav_list .title_2 {
    padding: 0 .5rem 0 1.5rem;
    text-align: left
}

.nav_list .title_3 {
    height: 6rem;
    line-height: 6rem;
    padding: 0 .5rem 0 1rem;
    text-align: left
}

.nav_list .title_4 {
    height: 3rem;
    line-height: 3rem;
    font-size: 1.2rem;
    color: #ccc
}

.nav_list span.flex {
    width: 100%;
    display: block;
    -webkit-box-flex: 1;
    box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden
}

.nav_list span.flex input {
    display: block;
    width: 100%;
    height: 3rem;
    line-height: 3rem;
    padding: 0 2rem 0 0;
    border: none;
    font-size: 1.6rem;
    background: 0 0;
    position: relative;
    color: #353535
}

.nav_list span.flex input.normal {
    padding-left: 1rem;
    text-align: left
}

.nav_list span.flex textarea {
    display: block;
    width: 100%;
    height: 6rem;
    line-height: 2rem;
    padding: 0 2rem 0 0;
    margin: .5rem 0 0 0;
    border: none;
    font-size: 1.6rem;
    background: 0 0;
    position: relative;
    color: #353535;
    resize: none;
    padding: 0 1rem
}

.nav_list span.flex input#forum_name,.nav_list span.flex textarea#forum_introduce {
    font-size: 13px
}

.nav_list .date_time {
    text-align: right
}

.nav_list .sp_bl {
    display: block;
    padding: 1rem
}

.nav_list .hot-point {
    background-color: #f33;
    height: 1rem;
    width: 1rem;
    display: inline-block;
    border-radius: 1rem;
    margin-right: .5rem;
    vertical-align: middle
}

.nav_list .list_btn_1,.nav_list .list_btn_2,.nav_list .list_btn_3 {
    display: block;
    width: 100%;
    padding: 0 2.5rem 0 2rem;
    border: none;
    color: #000;
    text-align: right;
    background: 0 0;
    position: relative;
    color: #909499;
    font-size: 1.4rem
}

.nav_list .list_btn_1,.nav_list .list_btn_3 {
    height: 3rem;
    line-height: 3rem
}

.list_btn_1:after,.list_btn_2:after {
    display: block;
    position: absolute;
    content: "";
    width: 1.8rem;
    height: 2.4rem;
    right: .5rem;
    top: 50%;
    margin-top: -1.2rem;
    background-position: -2rem -1.8rem
}

.list_btn_1.btnSetFree::after {
    display: none
}

.nav_list .list_btn_2 img {
    width: 6rem;
    height: 6rem
}

.list_btn_1 p,.list_btn_2 p,.list_btn_3 p {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

[class^=list_btn_] p var {
    color: #ff2534
}

.nav_list.list_1 {
    padding: 0
}

.nav_list.list_2 {
    padding: 0 0 0 1rem
}

.nav_list .btn_qlcheckbox {
    margin-top: .6rem
}

.nav_span {
    display: block;
    padding: 1rem;
    line-height: 2rem;
    font-size: 1.2rem;
    color: #999
}

[class^=wt_btn] {
    display: block;
    height: 4.6rem;
    line-height: 4.6rem;
    font-size: 1.8rem;
    text-align: center;
    color: #fff;
    border-radius: .3rem;
    background: #2984e2;
    text-decoration: none
}

.wt_btn_1 {
    border: solid 1px #2984e2
}

.wt_btn_2 {
    color: #00acff;
    background: #fff;
    border: solid 1px #999
}

[class*=tlbtn] {
    display: inline-block;
    height: 4.6rem;
    line-height: 4.6rem;
    font-size: 1.5rem;
    padding: 0 1.7rem;
    text-align: center;
    color: #fff;
    border-radius: .3rem;
    background-color: #2984e2;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer
}

[class*=qlbtn] {
    display: inline-block;
    height: 4rem;
    line-height: 4rem;
    margin: 0 auto;
    padding: 0 1.7rem;
    border-radius: 4rem;
    font-size: 1.5rem;
    text-align: center;
    text-decoration: none;
    background-color: #00acff;
    color: #fff;
    white-space: nowrap;
    cursor: pointer
}

[class*=qlbtna] {
    background-color: #ddf4ff;
    color: #00acff
}

[class*=qlbtnb] {
    background-color: #ffa200;
    color: #fff
}

[class*=stlbtn],[class^=sqlbtn] {
    height: 3rem;
    line-height: 3rem;
    font-size: 1.2rem
}

[class*=btn_org1] {
    background-color: #ffa200
}

[class*=btn_org2] {
    background-color: #fcf0d4;
    color: #ffb400
}

[class*=btn_org3] {
    background-color: #5a6579
}

[class*=btn_gre1] {
    background-color: #00c8bc
}

[class*=btn_gre2] {
    background-color: #d5fdfa;
    color: #00c8bc
}

[class*=btn_gre3] {
    background-color: #eff1f2;
    color: #888
}

[class*=btn_blu1] {
    background-color: #ddf4ff;
    color: #00acff
}

[class*=btn_blu2] {
    background-color: #fff;
    color: #00acff;
    border: 1px solid #00acff
}

[class*=btn_blu3] {
    background-color: #00acff
}

[class*=btn_red1] {
    background-color: #ffe7e7;
    color: #f46262
}

[class*=btn_red2] {
    background-color: #ff4b69;
    color: #fff
}

[class*=btn_red3] {
    background-color: #f84c69
}

[class*=tlbtn].ed,[class*=qlbtn].ed,[class*=btn_gra1] {
    background-color: #b9b9b9
}

[class*=tlbtn].sta,[class*=qlbtn].sta,[class*=btn_gra2] {
    background-color: #cedae0
}

[class*=btn_gra3] {
    background-color: #eff1f2;
    color: #00acff
}

[class*=tlbtn].tra,[class*=qlbtn].tra,[class*=btn_tra1] {
    background-color: rgba(0,0,0,.45)
}

[class*=blk] {
    display: block
}

[class*=wblk] {
    display: block;
    width: 100%
}

.text_state1 {
    color: #ffa200
}

.text_state2 {
    color: #949fa4
}

.text_state3 {
    color: #e95050
}

.text_state4 {
    color: #00acff
}

.text_state5 {
    color: #999
}

.text_state6 {
    color: #333
}

.text_state7 {
    color: #666
}

.text_statew {
    color: #fff
}

[class*=btn_switch] {
    position: relative;
    display: inline-block;
    width: 5.5rem;
    height: 3.2rem;
    border-radius: 3.2rem;
    cursor: pointer;
    background: #fff;
    border: 1px solid #ccc;
    transition: .5s;
    -moz-transition: .5s;
    -webkit-transition: .5s
}

[class*=btn_switch]:after {
    position: absolute;
    display: block;
    content: "";
    left: -.1rem;
    right: inherit;
    top: 0;
    width: 3rem;
    height: 3rem;
    border-radius: 3rem;
    background: #FFF;
    border: 1px solid #ccc
}

[class*=btn_switch].swon {
    background: #f84c69;
    border: 1px solid #f84c69
}

[class*=iMzhai] {
    background: #ffa200;
    display: block;
    width: 100%;
    margin: 0 auto;
    overflow: hidden
}

.swon:after {
    left: inherit;
    right: -.1rem;
    border: 1px solid #f84c69
}

i.qlbmi_QR_code {
    display: inline-block;
    width: 3rem;
    height: 3rem;
    background-position: -3rem 0
}

.btn_qlcheckbox,.btn_qlradio {
    display: inline-block;
    height: 2rem;
    line-height: 2rem;
    padding: 0 1rem 0 0;
    font-size: 1.2rem;
    color: 333333;
    cursor: pointer;
    white-space: nowrap;
    vertical-align: top
}

.btn_qlcheckbox:before,.btn_qlradio:before {
    display: inline-block;
    content: "";
    width: 1.8rem;
    height: 1.8rem;
    background: #f5f5f5;
    border: 1px solid #f5f5f5;
    border-radius: 2rem;
    vertical-align: top
}

.btn_qlcheckbox.on:before,.btn_qlradio.on:before {
    border: 1px solid #f84c69;
    background-position: -54.2rem -.2rem
}

.qlradio_list {
    cursor: pointer
}

.none_record {
    width: 100%;
    height: 17rem;
    position: relative
}

.none_pic {
    width: 100%;
    height: 20rem;
    position: relative;
    display: none;
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/ico_none.png) center center no-repeat;
    display: none
}

.none_pic1 {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/ico_norecord1.png) center center no-repeat;
    background-size: 12rem
}

.none_pic2 {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/ico_norecord8.png) top center no-repeat;
    background-size: 12rem;
    height: 13rem
}

.none_pic3 {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/ico_norecord3.png) center center no-repeat
}

.none_pic4 {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/ico_norecord4.png) center center no-repeat;
    display: none;
    background-size: 12rem
}

.none_pic5 {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/ico_norecord5.png) center center no-repeat;
    background-size: 8rem;
    margin-top: 3rem
}

.none_pic6 {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/ico_norecord6.png) center center no-repeat;
    background-size: 9rem;
    margin-top: 2rem
}

.none_pic7 {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/ico_norecord7.png) center center no-repeat;
    background-size: 10rem;
    height: 12rem;
    margin-bottom: 3rem
}

.none_pic8 {
    background: url(//cache1.qlchat.com/styles/wtwap/img/live/emptyPage.png) center center no-repeat;
    background-size: 10rem
}

.none_tip {
    position: absolute;
    bottom: 0;
    text-align: center;
    display: block;
    width: 100%;
    font-size: 1.5rem;
    color: #999;
    padding-right: 3%
}

[class*=WeRQL] {
    background: #fff200;
    display: block;
    width: 90%;
    margin: 1 auto;
    overflow: hidden
}

.loadingBox {
    display: none;
    z-index: 120;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center
}

.loadingBox:before {
    display: block;
    content: "";
    position: relative;
    z-index: 120;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .4;
    filter: alpha(opacity="40")
}

.loadingBox span {
    display: inline-block;
    position: absolute;
    z-index: 151;
    top: 50%;
    left: 50%;
    width: 5rem;
    height: 5rem;
    margin: -5rem 0 0 -2.5rem;
    font-size: 14px;
    color: #888;
    line-height: 25px;
    vertical-align: top;
    background: #fff url(//cache1.qlchat.com/styles/wtwap/img/live/qllogo_loading_1.gif) 0 0 no-repeat;
    background-size: 100%;
    border-radius: 100px
}

.popBox {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.4);
    z-index: 102
}

.popBox .pop_bg {
    position: absolute;
    z-index: 110;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    cursor: pointer
}

.popBox .main {
    position: absolute;
    z-index: 111;
    width: 80%;
    min-height: 12rem;
    left: 10%;
    top: 45%;
    margin: -8rem 0 0 0;
    padding-bottom: 4.1rem;
    background: #fff;
    border-radius: .7rem;
    overflow: hidden
}

.pop_top {
    display: block;
    width: 100%;
    padding: 0 1rem;
    height: 4rem;
    background-color: #fff;
    color: #2984e2;
    font-size: 1.6rem;
    text-align: center;
    line-height: 4rem
}

.pop_top span {
    word-break: break-all;
    display: inline-block
}

.popBox .pop_content {
    display: block;
    min-height: 5.9rem;
    padding: 1rem 2rem 1rem;
    text-align: center
}

.popBox .alignLeft {
    text-align: left
}

.pop_content span {
    display: inline-block;
    padding: 2rem 0;
    font-size: 1.6rem;
    line-height: 2rem;
    color: #666;
    word-break: break-all
}

.popBox .pop_bottom {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0 0;
    border-top: solid 1px #eee;
    white-space: nowrap
}

.popBox .pop_bottom .pop_btn {
    display: block;
    height: 4rem;
    line-height: 4rem;
    font-size: 1.5rem;
    margin: 0 0;
    text-align: center
}

.pop_btn.btn_cancel,.pop_btn.btn_confirm {
    color: #2984e2
}

.popBox .both .btn_confirm {
    color: #2984e2
}

.popBox .both .btn_cancel {
    color: #657084
}

.popBox .both span {
    display: inline-block;
    width: 50%
}

.popBox .both span:last-child {
    border-left: solid 1px #eee
}

.min_tips_box .bg {
    position: absolute;
    z-index: 130;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0;
    filter: alpha(opacity=0)
}

.min_tips_box .tips_content {
    position: absolute;
    z-index: 131;
    max-width: 85%;
    min-width: 12rem;
    line-height: 2rem;
    padding: 2.5rem 2.5rem;
    left: 50%;
    top: 50%;
    background: rgba(0,0,0,.7);
    border-radius: 5px;
    text-align: center;
    color: #fff;
    font-size: 1.5rem;
    box-shadow: 1px 1px 3px rgba(0,0,0,.4);
    word-break: break-all;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.min_tips_box.bottom .tips_content {
    top: auto;
    bottom: 10rem
}

.geneBox {
    display: none
}

.geneBox:before,.qlGbBg {
    position: absolute;
    content: "";
    z-index: 100;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .5;
    filter: alpha(opacity="50")
}

.qlGbBg {
    background: 0 0;
    cursor: pointer
}

.geneBox .main {
    position: absolute;
    z-index: 101;
    width: 80%;
    min-height: 15rem;
    left: 10%;
    top: 45%;
    margin: -13rem 0 0 0;
    background: #fff;
    border-radius: .7rem;
    overflow: hidden
}

.geneBox .gene_close {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 3rem;
    height: 3rem;
    background-position: -15rem 0;
    cursor: pointer
}

.geneBox .gene_content {
    display: block;
    min-height: 11rem;
    padding: 1rem 1rem 1rem;
    text-align: center
}

.geneBox .gene_content.alignLeft {
    text-align: left
}

.gene_content span {
    display: block;
    font-size: 1.6rem;
    line-height: 2rem;
    color: #666;
    word-break: break-all
}

.geneBox .gene_top {
    display: block;
    width: 100%;
    height: 4rem;
    background-color: #fff;
    color: #2984e2;
    font-size: 1.6rem;
    text-align: center;
    line-height: 7rem;
    white-space: nowrap
}

.geneBox .gene_bottom {
    display: block;
    width: 100%;
    padding: 0;
    border-top: solid 1px #eee;
    white-space: nowrap
}

.geneBox .gene_bottom .gene_btn {
    display: block;
    height: 4rem;
    line-height: 4rem;
    font-size: 1.5rem;
    margin: 0 0;
    text-align: center
}

.gene_btn.gene_cancel,.gene_btn.gene_confirm {
    color: #2984e2
}

.geneBox .both .gene_confirm {
    color: #2984e2
}

.geneBox .both .gene_cancel {
    color: #999
}

.geneBox .both span {
    display: inline-block;
    width: 50%
}

.geneBox .both span:last-child {
    border-left: solid 1px #eee
}

#pageLoadBox {
    display: none
}

.page_loading_box {
    display: none;
    text-align: center;
    line-height: 3rem;
    color: #899aa3;
    font-size: 1.4rem
}

.qlSelectBox {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 50
}

.qlSelectBox .qlSlBg {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .5;
    filter: alpha(opacity="50");
    cursor: pointer
}

.qlSelectBox .main {
    position: absolute;
    width: 25rem;
    left: 50%;
    top: 50%;
    margin-left: -12.5rem;
    background: #fff
}

.qlSelectBox .main .selectUl {
    display: block;
    width: 100%
}

.selectUl li {
    display: block;
    height: 3.5rem;
    padding: 0 1rem;
    line-height: 3.5rem;
    font-size: 1.4rem;
    color: #888;
    border-bottom: #eee solid 1px;
    cursor: pointer
}

.selectUl li:last-child {
    border: none
}

.selectUl li:hover {
    background: #eee
}

[class^=qlMsgTips] {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(0,0,0,.4);
    -webkit-overflow-scrolling: touch;
    overflow: hidden;
    overflow-y: scroll
}

[class^=qlMsgTips] .qlMTBg {
    position: absolute;
    content: "";
    z-index: 100;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    opacity: .5;
    filter: alpha(opacity="50");
    cursor: pointer
}

[class^=qlMsgTips] .qlMT_top {
    display: block;
    width: 100%;
    min-height: 4rem;
    padding: 3rem 0 1rem;
    background-color: #fff;
    color: #404040;
    font-size: 1.6rem;
    text-align: center;
    line-height: 2rem;
    white-space: nowrap
}

[class^=qlMsgTips] .qlMT_top2 {
    display: block;
    width: 100%;
    min-height: 4rem;
    padding: 3rem 0 1rem;
    background-color: #fff;
    color: #657084;
    font-size: 1.6rem;
    text-align: center;
    line-height: 2rem;
    white-space: nowrap
}

[class^=qlMsgTips] .qlMT_close {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 3rem;
    height: 3rem;
    background-position: -15rem 0;
    cursor: pointer
}

[class^=qlMsgTips] .qlMT_close2 {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 3rem;
    height: 3rem;
    background-position: -12rem 0;
    cursor: pointer
}

[class^=qlMsgTips] .main {
    position: absolute;
    z-index: 101;
    width: 90%;
    left: 5%;
    top: 50%;
    margin: -13rem 0 1.5rem 0;
    background: #fff;
    border-radius: 5px;
    overflow: hidden;
    transition: .2s;
    -webkit-transition: .2s
}

.qMS .main {
    position: absolute;
    top: 15px;
    margin-top: 0
}

[class^=qlMsgTips] .qlMT_content {
    text-align: center;
    padding: 1rem 2rem 0;
    font-size: 1.4rem
}

[class^=qlMsgTips] .qlMT_content.AlignLeft {
    text-align: left
}

.qlMT_content img {
    max-width: 100%
}

[class^=qlMsgTips] .qlMTBottom {
    padding: 2rem 1rem;
    text-align: center
}

[class^=qlMsgTips] .qlMTBottom2 {
    text-align: center;
    margin-top: 1rem
}

[class^=qlMsgTips] .boxFlex {
    padding: 0 1rem
}

[class^=qlMsgTips] [class*=tlbtn] {
    height: 4.5rem;
    line-height: 4.5rem;
    font-size: 1.6rem
}

[class^=qlMsgTips] .qlMTBottom [class*=tlbtn] {
    width: 100%
}

.qlMTBottom2 [class*=tlbtn] {
    width: 100%;
    border-radius: 0;
    color: #f73657;
    background-color: #fff
}

.qlMTBottom .tlbtn_cancel {
    border: solid 1px #657084;
    background: #fff;
    color: #657084
}

.qlMTBottom2 .tlbtn_cancel {
    border-top: solid 1px #e5e5e5;
    border-right: solid 1px #e5e5e5;
    color: #404040
}

.qlMTBottom2 .tlbtn_confirm {
    border-top: solid 1px #e5e5e5
}

[class^=qlMsgTips] .span_1 {
    display: block;
    padding: 1rem 2rem
}

[class^=qlMsgTips] .qlMT_input {
    display: block;
    width: 100%;
    height: 4rem;
    padding: 0 1rem;
    line-height: 2rem;
    background: #f6f6f6;
    border: none;
    font-size: 1.4rem;
    border-radius: .3rem;
    color: #333
}

[class^=qlMsgTips] .qlMT_textarea {
    display: block;
    width: 100%;
    height: 12rem;
    padding: .5rem;
    margin: 0 auto;
    line-height: 2rem;
    color: #333;
    background: #f8fbfc;
    border: solid 1px #e5e5e5;
    border-radius: .5rem;
    font-size: 1.6rem;
    resize: none
}

[class^=qlMsgTips] .textonly_tips {
    padding: 2rem;
    display: block;
    line-height: 2rem
}

[class^=qlMsgTips] .qlMT_input:placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_input::-webkit-input-placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_input::-moz-placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_input::-ms-input-placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_input::-o-input-placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_textarea:placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_textarea::-webkit-input-placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_textarea::-moz-placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_textarea::-ms-input-placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_textarea::-o-input-placeholder {
    color: #ccc
}

[class^=qlMsgTips] .qlMT_content .qlMT_qr {
    display: block;
    width: 15rem;
    height: 15rem;
    overflow: hidden;
    margin: 0 auto
}

[class^=qlMsgTips] .qlMT_content .qlMT_qr img {
    width: 100%;
    height: 100%
}

.qlMsgTips .banner {
    display: block;
    width: 100%;
    margin: 0;
    background: #33bdff;
    padding: 1rem 0;
    text-align: center
}

.qlMsgTips .banner .ico_1 {
    display: inline-block;
    width: 6rem;
    height: 6rem;
    border-radius: 6rem;
    overflow: hidden
}

.qlMsgTips .banner .ico_1 img {
    width: 100%;
    height: 100%
}

.qlMsgTips .banner .banner_title {
    display: block;
    height: 2rem;
    line-height: 2rem;
    font-weight: 400;
    text-align: center;
    color: #fff;
    font-size: 1.4rem;
    color: #fff
}

.qlMsg_content {
    padding: 2rem;
    font-size: 1.4rem
}

.coupon_detail span {
    display: block;
    line-height: 2rem
}

.coupon_detail var {
    padding-left: 1rem
}

.qlMsgTips .banner {
    display: block;
    width: 100%;
    margin: 0;
    background: #33bdff;
    padding: 1rem 0;
    text-align: center
}

.qlMsgTips .banner .ico_choose {
    display: inline-block;
    width: 5rem;
    height: 5rem;
    border-radius: 5rem;
    overflow: hidden;
    background-color: #fff;
    background-position: -5rem -5rem
}

.qlMsgTips .banner .banner_title {
    display: block;
    height: 2rem;
    line-height: 2rem;
    font-weight: 400;
    text-align: center;
    color: #fff;
    font-size: 1.4rem;
    color: #fff
}

.box_404 {
    position: absolute;
    width: 100%;
    height: 22rem;
    top: 50%;
    margin-top: -11rem;
    text-align: center
}

.box_404 img {
    display: inline-block;
    width: 10rem;
    margin: 0 auto 1rem
}

.box_404 .tips_1,.box_404 .tips_2 {
    display: block;
    line-height: 3rem;
    padding: .5rem 0 0;
    color: #899aa3
}

.box_404 .tips_2 var {
    color: #2984e2
}

.box_404 .tips_1 {
    font-size: 1.6rem
}

.box_404 .tips_2 {
    font-size: 1.4rem
}

.loadStBox {
    display: block;
    height: 3rem;
    width: 100%
}

.box_nothing {
    display: none;
    text-align: center;
    padding: 0 0 1rem
}

.box_nothing img {
    display: inline-block;
    width: 12rem;
    margin: 6rem auto 2rem
}

.box_nothing .tips_1 {
    display: block;
    line-height: 3rem;
    padding: .5rem 0 0;
    color: #899aa3;
    font-size: 1.3rem
}

.focusQr2Box,.focusQr3Box,.focusQrpayBox,.payQrBox {
    cursor: pointer
}

.focusQr2Box img,.focusQr3Box img,.focusQrpayBox img,.payQrBox img {
    width: 75%
}

.focusQr2Box span,.focusQr3Box span,.focusQrpayBox span,.payQrBox span {
    display: block;
    width: 100%;
    text-align: center;
    line-height: 2rem
}

.focusQr_span_1 {
    color: #333
}

.focusQr_span_2 {
    color: #b8b8b8;
    margin-bottom: 1rem
}

.payQr_span_1 {
    margin-top: 1rem
}

.payQr_span_2 {
    margin-bottom: 1rem
}

.badge {
    position: relative
}

.badge .newPoint {
    position: absolute;
    height: 1.5rem;
    font-size: 1.2rem;
    left: 50%;
    background: #f14a4e;
    color: #fff;
    text-align: center;
    line-height: 1.5rem;
    border-radius: 5rem;
    padding: 0 .5rem;
    min-height: 1rem;
    min-width: 1.5rem
}

.mineNewPoint {
    width: .8rem;
    height: .8rem;
    display: inline-block;
    background: #f14a4e;
    border-radius: 50%;
    margin-top: 1.5rem;
    vertical-align: top
}

.tab-mine .mineNewPoint {
    vertical-align: top;
    margin-left: .5rem;
    margin-top: .2rem;
    position: absolute;
    left: 50%
}

[class^=ql_notice] {
    position: relative;
    display: block;
    margin: 1rem;
    padding: 1rem;
    background: #fff
}

[class^=ql_notice] .qlbmibtn_closed {
    position: absolute;
    right: 0;
    top: 0;
    background-position: -12rem 0;
    display: inline-block;
    width: 3rem;
    height: 3rem
}

.follow_qianliao ul {
    display: block;
    text-align: center
}

.follow_qianliao li {
    display: block
}

.follow_qianliao .li_1 {
    height: 3rem;
    line-height: 3rem;
    font-size: 1.2rem;
    color: #949fa4
}

.follow_qianliao .li_3 {
    height: 2rem;
    line-height: 2rem;
    font-size: 1.2rem;
    color: #333
}

.follow_qianliao .li_4 {
    height: 3rem;
    line-height: 3rem;
    font-size: 1.2rem;
    color: #00acff
}

.follow_qianliao .li_2 img {
    display: inline-block;
    height: 12rem;
    width: 12rem
}

.fbold {
    font-weight: 700
}

.pushBox span,.pushChannelBox span {
    text-align: center;
    display: block;
    line-height: 2rem;
    font-size: 1.4rem
}

.pushBox .push_top,.pushChannelBox .push_top {
    color: #fff;
    background-color: #2984e2;
    padding: 3rem;
    text-align: center
}

.pushBox .push_top span,.pushChannelBox .push_top span {
    display: inline-block;
    margin: 0 auto;
    text-align: left;
    line-height: 2rem
}

.push_span_1 {
    height: 3.5rem;
    display: block
}

.push_span_1 a {
    color: #00acff
}

.push_span_2 {
    color: #999;
    margin: 1rem
}

.push_span_2 var {
    color: #f14a4e
}

.pushChannelBox span {
    padding: 2rem
}

.pushChannelBox .push_top {
    padding: 0
}

.bottom_box {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 8;
    height: 100%;
    width: 100%;
    background-color: rgba(0,0,0,.4)
}

.bottom_box .bottom_shade {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 8;
    height: 100%;
    width: 100%;
    background-color: transparent;
    cursor: pointer
}

.bottom_box_main {
    width: 100%;
    position: absolute;
    z-index: 10;
    bottom: 0;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: all .6s;
    -webkit-transition: all 1s;
    transition: all 1s
}

.bottom_box_main.on {
    max-height: 60rem
}

.bottom_box_main li {
    height: 4.5rem;
    line-height: 4.5rem;
    color: #333;
    font-size: 1.4rem;
    padding: 0 1rem;
    background-color: #fff;
    border-bottom: 1px solid #e5e5e5;
    cursor: pointer
}

.bottom_box_main .gray {
    color: #999;
    font-size: 1.4rem
}

.bottom_box_main .warning {
    color: #f46262;
    font-weight: 400
}

.bottom_box_main .tips {
    color: #999;
    font-weight: 400
}

.bottom_box_main .small {
    font-size: 1.2rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.bottom_box_main span {
    margin-right: 1rem
}

.bottom_box_main .cancel {
    color: #999;
    background-color: #f9f9f9;
    text-align: center;
    font-size: 1.5rem;
    cursor: pointer
}

.bottom_box_main .header {
    height: 4rem;
    background-color: #33bdff;
    color: #fff;
    text-align: center
}

.bottom_box_main .titleCtrl {
    height: 4rem;
    display: block;
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.sl_loading {
    display: none;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10
}

.sl_loading:before {
    content: '';
    display: block;
    width: 10rem;
    height: 10rem;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -5rem;
    margin-top: -5rem;
    border-radius: .5rem;
    background-color: rgba(0,0,0,.5)
}

.sl_loading .loadingbox {
    width: 10rem;
    height: 10rem;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -5rem;
    margin-top: -5rem;
    text-align: center;
    line-height: 10rem
}

.sl_loading .loadingbox span {
    display: inline-block;
    width: .4rem;
    height: 2rem;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -2rem;
    margin-left: -2rem;
    background-color: #fff
}

.sl_loading .loadingbox span:nth-child(1) {
    margin-top: -1rem;
    margin-left: -1.8rem;
    animation: heightmove1 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -moz-animation: heightmove1 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -webkit-animation: heightmove1 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite
}

.sl_loading .loadingbox span:nth-child(2) {
    margin-top: -1rem;
    margin-left: -1rem;
    animation: heightmove2 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -moz-animation: heightmove2 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -webkit-animation: heightmove2 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite
}

.sl_loading .loadingbox span:nth-child(3) {
    margin-top: -1.5rem;
    margin-left: -.2rem;
    animation: heightmove3 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -moz-animation: heightmove3 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -webkit-animation: heightmove3 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite
}

.sl_loading .loadingbox span:nth-child(4) {
    margin-top: -1rem;
    margin-left: .6rem;
    animation: heightmove4 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -moz-animation: heightmove4 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -webkit-animation: heightmove4 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite
}

.sl_loading .loadingbox span:nth-child(5) {
    margin-top: -1rem;
    margin-left: 1.4rem;
    animation: heightmove5 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -moz-animation: heightmove5 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite;
    -webkit-animation: heightmove5 .9s cubic-bezier(.72,.41,.41,.68) .1s infinite
}

@-webkit-keyframes heightmove1 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    16% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    24% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    32% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    40% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    48% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    56% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    64% {
        height: 1rem;
        margin-top: -.5rem
    }

    72% {
        height: 1rem;
        margin-top: -.5rem
    }

    80% {
        height: 1rem;
        margin-top: -.5rem
    }

    88% {
        height: 1rem;
        margin-top: -.5rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@keyframes heightmove1 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    16% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    24% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    32% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    40% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    48% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    56% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    64% {
        height: 1rem;
        margin-top: -.5rem
    }

    72% {
        height: 1rem;
        margin-top: -.5rem
    }

    80% {
        height: 1rem;
        margin-top: -.5rem
    }

    88% {
        height: 1rem;
        margin-top: -.5rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@-webkit-keyframes heightmove2 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1rem;
        margin-top: -.5rem
    }

    16% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    24% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    32% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    40% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    48% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    56% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    64% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    72% {
        height: 1rem;
        margin-top: -.5rem
    }

    80% {
        height: 1rem;
        margin-top: -.5rem
    }

    88% {
        height: 1rem;
        margin-top: -.5rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@keyframes heightmove2 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1rem;
        margin-top: -.5rem
    }

    16% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    24% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    32% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    40% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    48% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    56% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    64% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    72% {
        height: 1rem;
        margin-top: -.5rem
    }

    80% {
        height: 1rem;
        margin-top: -.5rem
    }

    88% {
        height: 1rem;
        margin-top: -.5rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@-webkit-keyframes heightmove3 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1rem;
        margin-top: -.5rem
    }

    16% {
        height: 1rem;
        margin-top: -.5rem
    }

    24% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    32% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    40% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    48% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    56% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    64% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    72% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    80% {
        height: 1rem;
        margin-top: -.5rem
    }

    88% {
        height: 1rem;
        margin-top: -.5rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@keyframes heightmove3 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1rem;
        margin-top: -.5rem
    }

    16% {
        height: 1rem;
        margin-top: -.5rem
    }

    24% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    32% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    40% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    48% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    56% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    64% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    72% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    80% {
        height: 1rem;
        margin-top: -.5rem
    }

    88% {
        height: 1rem;
        margin-top: -.5rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@-webkit-keyframes heightmove4 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1rem;
        margin-top: -.5rem
    }

    16% {
        height: 1rem;
        margin-top: -.5rem
    }

    24% {
        height: 1rem;
        margin-top: -.5rem
    }

    32% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    40% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    48% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    56% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    64% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    72% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    80% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    88% {
        height: 1rem;
        margin-top: -.5rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@keyframes heightmove4 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1rem;
        margin-top: -.5rem
    }

    16% {
        height: 1rem;
        margin-top: -.5rem
    }

    24% {
        height: 1rem;
        margin-top: -.5rem
    }

    32% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    40% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    48% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    56% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    64% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    72% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    80% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    88% {
        height: 1rem;
        margin-top: -.5rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@-webkit-keyframes heightmove5 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1rem;
        margin-top: -.5rem
    }

    16% {
        height: 1rem;
        margin-top: -.5rem
    }

    24% {
        height: 1rem;
        margin-top: -.5rem
    }

    32% {
        height: 1rem;
        margin-top: -.5rem
    }

    40% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    48% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    56% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    64% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    72% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    80% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    88% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

@keyframes heightmove5 {
    0% {
        height: 1rem;
        margin-top: -.5rem
    }

    8% {
        height: 1rem;
        margin-top: -.5rem
    }

    16% {
        height: 1rem;
        margin-top: -.5rem
    }

    24% {
        height: 1rem;
        margin-top: -.5rem
    }

    32% {
        height: 1rem;
        margin-top: -.5rem
    }

    40% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    48% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    56% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    64% {
        height: 2.8rem;
        margin-top: -1.4rem
    }

    72% {
        height: 2.2rem;
        margin-top: -1.1rem
    }

    80% {
        height: 1.8rem;
        margin-top: -.9rem
    }

    88% {
        height: 1.4rem;
        margin-top: -.7rem
    }

    96% {
        height: 1rem;
        margin-top: -.5rem
    }

    100% {
        height: 1rem;
        margin-top: -.5rem
    }
}

.qlbga-v-live {
    cursor: pointer
}

.qlbga-v-live::after {
    content: '';
    background-position: -30rem -4rem;
    width: 2rem;
    height: 2rem;
    margin-left: .5rem;
    cursor: pointer
}

.qlbga-t-live {
    cursor: pointer
}

.qlbga-t-live::after {
    content: '';
    background-position: -48rem -4rem;
    width: 2rem;
    height: 2rem;
    margin-left: .5rem;
    cursor: pointer
}

#v-live-tips p {
    text-align: left;
    margin-bottom: 1rem;
    line-height: 2rem
}

.qlMsgTips .v-live-tips {
    color: #00acff
}

.nav_list_cascade li {
    width: 100%;
    background-color: #fff;
    height: 5.5rem;
    padding: 0 0 0 1rem;
    position: relative;
    display: block
}

.nav_list_cascade span.spacer {
    height: 3rem;
    line-height: 3rem;
    color: #333;
    font-size: 1.4rem;
    background-color: #f2f2f2;
    padding: 0 1rem
}

.nav_list_cascade .icon_checked {
    width: 2rem;
    height: 2rem;
    display: block;
    border-radius: 10rem;
    color: #fff;
    background-color: #fff;
    border: 1px solid #e5e5e5;
    position: absolute;
    top: 1rem;
    text-align: center;
    line-height: 2rem
}

.nav_list_cascade .icon_checked.on {
    background-color: #3bcb59;
    border: none
}

.nav_list_cascade li .desc {
    margin-left: 3rem;
    border-bottom: 1px solid #e5e5e5;
    width: 100%;
    height: 100%
}

.nav_list_cascade li:last-child .desc {
    border-bottom: none
}

.nav_list_cascade li h2 {
    font-size: 1.4rem;
    color: #333;
    font-weight: 400;
    padding-top: 1rem
}

.nav_list_cascade li p {
    font-size: 1.2rem;
    color: #ccc;
    margin-top: 1rem
}

.slider-container {
    position: relative;
    overflow: hidden;
    height: 100%;
    cursor: all-scroll;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-overflow-scrolling: touch
}

.slider-container::after {
    display: block;
    padding-bottom: 54%;
    content: ''
}

.slider-pagi {
    font-size: 0;
    position: absolute;
    z-index: 3;
    bottom: 1.5rem;
    right: 1rem;
    list-style-type: none
}

.slider-pagi__elem {
    position: relative;
    display: inline-block;
    width: .8rem;
    height: .8rem;
    margin: 0 .5rem;
    cursor: pointer;
    vertical-align: top;
    border-radius: 50%;
    background: rgba(0,0,0,.5)
}

.slider-pagi__elem:before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: .8rem;
    height: .8rem;
    content: "";
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s,-webkit-transform .3s;
    -webkit-transform: translate(-50%,-50%) scale(0);
    transform: translate(-50%,-50%) scale(0);
    border-radius: 50%;
    background: #fff
}

.slider-pagi__elem.active:before,.slider-pagi__elem:hover:before {
    -webkit-transform: translate(-50%,-50%) scale(1);
    transform: translate(-50%,-50%) scale(1)
}

.slider {
    position: absolute;
    z-index: 1;
    height: 100%;
    width: 100%
}

.slider.animating {
    -webkit-transition: -webkit-transform .5s;
    transition: -webkit-transform .5s;
    transition: transform .5s;
    transition: transform .5s,-webkit-transform .5s;
    will-change: transform
}

.slider.animating .slide__bg {
    -webkit-transition: -webkit-transform .5s;
    transition: -webkit-transform .5s;
    transition: transform .5s;
    transition: transform .5s,-webkit-transform .5s;
    will-change: transform
}

.slide {
    position: absolute;
    top: 0;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-color: #000
}

.slide__bg {
    position: absolute;
    top: 0;
    left: -50%;
    width: 100%;
    height: 100%;
    background-size: cover;
    will-change: transform
}

.slide__bg img {
    width: 100%
}

.slider_title {
    display: block;
    width: 100%;
    height: 4rem;
    position: absolute;
    bottom: 0;
    left: 0;
    color: #fff;
    font-size: 1.3rem;
    line-height: 3rem;
    padding: .5rem 15rem .5rem 1rem;
    background-color: rgba(0,0,0,.5)
}

#t-live-tips p {
    text-align: left;
    margin-bottom: 1rem;
    line-height: 2rem
}

.qlMsgTips .t-live-tips {
    text-align: left;
    line-height: 2rem;
    margin-top: -1rem
}

#t-live-tips .tlbtn_cancel {
    color: #999
}

.gifShadow {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(0,0,0,0);
    text-align: center;
    display: block;
    top: 0;
    left: 0
}

.gifShadow b {
    color: #fff;
    position: absolute;
    font-size: 1.5rem;
    left: 1rem;
    bottom: 1rem;
    display: inline-block;
    border: 1px solid rgba(255,255,255,.4);
    padding: 0 1.2rem;
    font-weight: 400;
    height: 2.5rem;
    line-height: 2.5rem;
    border-radius: 5rem;
    background-color: rgba(0,0,0,.5)
}
